.uploadPopup
  .cardPopup__container
    width 400px

.profile
  &__text__loading
    background-color lightGrey2
    height 20px
    width 200px
    margin standardSpacing
  &__imageUploadProgress
    width 400px
  &__popup_select_cover
    width 50%
  &__cover
    height 150px
    width 100%
    display flex
    align-items flex-end
    justify-content center
    background-image url('../img/default_cover_image.png')
    background-repeat repeat
    position relative
    &__changeBtn
      position absolute
      bottom standardSpacing
      background-color offWhite
      &:hover
        background-color lightGrey2
    &__loading
      margin standardSpacing
    &__image
      width 100%
      height 100%
      object-position 50% 50%
      object-fit cover
  &__mainBar
    height headerHeight
    padding-inline-start pageSpacing
    background-color offWhite
    display flex
    &__btnGrp
      display flex
      flex-direction row
      margin standardSpacing pageSpacing
      &__btn
        align-self start
        margin 0 standardSpacing
    &__avatar
      position relative
      &__medium
        display none
      &__big
        position relative
        top -20px
      &__changeBtn
        position absolute
        bottom -15px
        width 25px
        height 25px
        & .iconbutton__icon
          margin 0px
    &__info
      margin-inline-start standardSpacing
      font-size titleFontSize
      align-self center
      flex 1
      &__wrapper
        display flex
        flex-grow 1
      &__user
        display flex
        &__name
          max-width 50%
          overflow hidden
          text-overflow ellipsis
          white-space pre
        &__username
          overflow hidden
          unicode-bidi plaintext
          text-overflow ellipsis
          &__wrapper
            max-width 50%
            display inline-flex
            font-size standardFontSize
            align-items center
          &__separator
            margin 0px 5px

  &__content
    display flex
    & > div
      overflow-wrap anywhere
      background-color offWhite
      height max-content
      min-height 300px
      border-radius standardBorderRadius
      padding standardSpacing
    &__information
      margin-top pageSpacing
      margin-inline-end 0
      margin-bottom pageSpacing
      margin-inline-start pageSpacing
      width 30%
    &__page
      margin-top pageSpacing
      margin-inline-end pageSpacing
      margin-bottom pageSpacing
      margin-inline-start standardSpacing
      width 70%
    &__loading
      background-color lightGrey2
      height 200px
      margin standardSpacing
  &__customForm__submit
    position absolute
    top 0

.DisplaySchemaPropertyString__label
  white-space nowrap
  margin-inline-end textSpacing

[dir=ltr] .profile
  &__cover__changeBtn
    right pageSpacing
  &__customForm__submit
    right 0
  &__mainBar__avatar__changeBtn
    right -5px

[dir=rtl] .profile
  &__cover__changeBtn
    left pageSpacing
  &__customForm__submit
    left 0
  &__mainBar__avatar__changeBtn
    left -5px

@media (max-width: max-sm)
  .profile
    &__cover
      height 70px
      &__changeBtn > span
        display none

    &__mainBar
      height 50px
      padding-inline-start standardSpacing
      &__avatar
        &__big
          display none
        &__medium
          display unset
      &__info
        font-size titleFontSize
        & .breadcrumbs
          display none
        &__user
          display flex
          flex-direction column
          &__name
            max-width 60%
          &__username
            max-width 100%
            font-size metadataFontSize
            &__separator
              display none

    &__content
      flex-direction column
      & > div
        font-weight normal
        min-height 150px
        padding standardSpacing
      &__information
        margin 20px standardSpacing
        width calc(100% - 20px)
      &__page
        margin 0px standardSpacing
        width calc(100% - 20px)
